import React from 'react';
import { browserHistory } from 'react-router'
import { ROOTAPI,ROOTURL } from '../../publicAPI/publicAPI.js'
import { couponTime } from '../../publicAPI/alist.js'
import stamp from '../img/discount/stamp.jpg'


require('../css/FacialmaskDiscount.css');
class FacialmaskDiscount extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
        discounts: []
    }
  }
  componentWillMount(){
      
  }
  componentDidMount(){
    this.getDiscount();
    // 添加属性使页面可以滑动
    document.getElementById("content").style.height = "auto";
    document.getElementById("content").style.overflow = "scroll";
    document.getElementsByTagName("body")[0].style.height = "auto";
    document.getElementsByTagName("body")[0].style.overflow = "scroll";
    document.getElementsByTagName("html")[0].style.height = "auto";
    document.getElementsByTagName("html")[0].style.overflow = "scroll";
  }
  componentWillUnmount() {
    // 清除页面滑动属性
    document.getElementById("content").style.height = "100%";
    document.getElementById("content").style.overflow = "hidden";
    document.getElementsByTagName("body")[0].style.height = "100%";
    document.getElementsByTagName("body")[0].style.overflow = "hidden";
    document.getElementsByTagName("html")[0].style.height = "100%";
    document.getElementsByTagName("html")[0].style.overflow = "hidden";
  }
  /*获取全部优惠券*/
	getDiscount() {
		let { id } = JSON.parse(localStorage.getItem('customerInfo'));
	 	let url = ROOTAPI+'kabuy/coupon/coupon/search.api'
  	fetch(url, {
          method : 'POST',
          mode: 'cors',
          body: JSON.stringify({
            	where: {
      					possessorId: [
      						['eq', id]
      					],
      				}
            })
          }).then(res=>{
              if(res.ok){
                  res.json().then(data=>{
                      this.setState({					  	
        						  	discounts:data  
        						  })
                  })
              }
          }) 
	}
	toBuys() {
		browserHistory.push({pathname:`/`,query:{}});
	}
  render() {
  	let _this = this;
    return (
      <div className="fm-discount">
  			{
  				this.state.discounts.map(function(item, index){
  					return (
  						<div key={index} className="fm-discount-item">
  							<div className="fm-discount-item-stamp"><img src={stamp}/></div>
  							<div className="fm-discount-item-word">
  								<div className="fm-discount-item-word1">{item.couponType.dname}</div>
  								<div className="fm-discount-item-word2">有效期：{item.tmDeteriorate?couponTime(item.tmDeteriorate):"永久有效"}</div>
  							</div>
                {
                  item.stConsume?
                  <div className="fm-discount-item-button-use">已使用</div>
    							:
                  (item.tmDeteriorate+86400000<new Date().getTime()?<div className="fm-discount-item-button-use">已过期</div>:<div className="fm-discount-item-button" onClick={_this.toBuys.bind(_this)}>点击使用</div>)
  							}
                <div className="clear"></div>
  						</div>
  					)	
  				})
  			}
      </div>
    )
  }
}


export default FacialmaskDiscount;